<extend name="Common:main" />
<block name="cssjs">

</block>
<block name="content">
<div class="nav-tabs-custom">
	<ul class="nav nav-tabs">
    	<li><a href="{:U('Setting/Caiji')}">采集设置</a></li>
    	<li class="active"><a href="{:U('Setting/Proxy')}">代理设置</a></li>
	</ul>
	<div class="tab-content">
		<div class="tab-pane active" style="padding:0px 5px;">
		<form id="form_set" method="post" ajax-submit="true" role="form" action="{:U('Admin/Setting/proxy')}">
      		<div class="form-group">
		        <label>开启代理</label>
		        <div class="input-group">
		        	<label class="radio-inline"><input type="radio" name="open" value="1">{$Think.lang.yes}</label>
		        	<label class="radio-inline"><input type="radio" name="open" value="0">{$Think.lang.no}</label>
		        </div>
		    </div>
		    <div id="proxy_open" style="display:none;">
     		<div class="h-title">
     			<label class="control-label">代理IP</label>
      			<a href="javascript:;" id="add_proxy_ip" class="glyphicon glyphicon-plus" title="添加"></a>
      		</div>
		    <div class="form-group">
    			<div class="table-responsive proxy-ip-list">
	            	<table class="table table-hover" id="proxy_ip_table" style="margin-bottom:0;">
	                   <thead>
	                       <tr>
	                           <th class="col-xs-5">IP（可带端口）</th>
	                           <th class="col-xs-3">用户名（选填）</th>
	                           <th class="col-xs-3">密码（选填）</th>
	                           <th class="col-xs-1">删除</th>
	                       </tr>
	                   </thead>
	                   <tbody>
	                   </tbody>
					</table>
	        	</div>
      		<div class="help-block">多个IP将随机使用</div>
      		</div>
      		</div>
		   	<div class="form-group">
				<button type="submit" class="btn btn-primary btn-block">{$Think.lang.save}</button>
			</div>
		</form>
		</div>
	</div>
</div>
<script type="text/javascript">
$('[name="open"]').bind('click',function(){
	if($(this).val()==1){
		$('#proxy_open').show();
	}else{
		$('#proxy_open').hide();
	}
});
//添加代理ip
function add_proxy_ip(ip,user,pwd){
	var html='<tr><td><input type="text" name="ip_list[]" class="form-control" value="'+ip+'" /></td>'
		+'<td><input type="text" name="user_list[]" class="form-control" value="'+user+'" /></td>'
		+'<td><input type="text" name="pwd_list[]" class="form-control" value="'+pwd+'" /></td>'
		+'<td><a href="javascript:;" class="glyphicon glyphicon-remove delete-proxy-ip"></a></td></tr>';
	$('#proxy_ip_table tbody').append(html);
}
//添加
$('#add_proxy_ip').bind('click',function(){
	add_proxy_ip('','','');
});
//删除
$('#proxy_ip_table').on('click','.delete-proxy-ip',function(){
	$(this).parents('tr').eq(0).remove();
});

<if condition="!empty($proxyConfig)">
(function(){
	//载入数据
	var proxy_config={$proxyConfig|json_encode};
	//开关
	$('[name="open"][value="'+parseInt(proxy_config.open)+'"]').trigger('click');
	//载入ip
	if(proxy_config.ip_list){
		var user_list=proxy_config.user_list?proxy_config.user_list:{};
		var pwd_list=proxy_config.pwd_list?proxy_config.pwd_list:{};
		for(var i in proxy_config.ip_list){
			add_proxy_ip(proxy_config.ip_list[i],user_list[i],pwd_list[i]);
		}
	}
})();
</if>
</script>
</block>